<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="layout" content="main3"/>
    <title>云信 Web Demo</title>
    <asset:stylesheet src="boc/remoteSignface/base.css"/>
    <asset:stylesheet src="boc/remoteSignface/animate.css"/>
    <asset:stylesheet src="boc/remoteSignface/jquery-ui.css"/>
    <asset:stylesheet src="boc/remoteSignface/contextMenu/jquery.contextMenu.css"/>
    <asset:stylesheet src="boc/remoteSignface/minAlert.css"/>
    <asset:stylesheet src="boc/remoteSignface/main.css"/>
    <asset:stylesheet src="boc/remoteSignface/uiKit.css"/>
    <asset:stylesheet src="boc/remoteSignface/CEmojiEngine.css"/>
    <asset:stylesheet src="boc/remoteSignface/rangeslider.css"/>
    <asset:stylesheet src="boc/remoteSignface/pure-min.css"/>
    <asset:stylesheet src="boc/remoteSignface/whiteboard.css"/>
    <style>
    .panelStyle{
        background-image: url(/assets/boc/bg_netcall.png);
        background-size: cover;
        background-position: 50% 50%;
        height: 350px;
    }
    .imgList{
        margin-top: 15px;
        display: none;
    }
    .imgList>div{
        width: 197px;
        height: 230px;
        float: left;
        /*border:1px solid;*/
        margin-right: 5px;
        margin-top: 5px;
        text-align: center;
    }
    .imgList>div>div:first-child{
        margin-top: 5px;
    }
    .imgList img{
        margin: 10px 0;
    }
</style>
</head>

<body onunload="CloseOpen(event)">
<div class="bad-network hide tc radius5px" id="errorNetwork">已与服务器断开，请检查网络连接</div>
<div class="wrapper box-sizing">
    <div class="row">
        <div class="col-lg-12">
            <div class="hpanel">
                <div class="panel-heading">
                    <div class="panel-tools">
                        <a class="showhide"><i class="fa fa-chevron-up"></i></a>
                        %{--<a class="closebox"><i class="fa fa-times"></i></a>--}%
                    </div>
                    客户基本信息
                </div>
                <div class="panel-body">
                    <div class="table-responsive">
                        <table cellpadding="1" cellspacing="1" class="table table-bordered table-striped text-center">
                            <thead>
                            <tr>
                                <th>姓名</th>
                                <th>身份证号</th>
                                <th>手机号</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td ><span id="opp_fullName"></span></td>
                                <td ><span id="opp_idNumber"></span></td>
                                <td ><span id="opp_cellphone"></span></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>

                </div>
                %{--<div class="panel-footer">
                    Table - 6 rows
                </div>--}%
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <div class="hpanel hyellow">
                <div class="panel-heading">
                    <div class="panel-tools">
                        <a class="showhide"><i class="fa fa-chevron-up"></i></a>
                        %{--<a class="closebox"><i class="fa fa-times"></i></a>--}%
                    </div>
                    影像资料
                </div>
                <div class="panel-body">
                    <div class="row">
                        <div class="col-lg-offset-3 col-lg-6 border-right">
                            <div class="panelStyle"></div>
                            <div class="content">
                                <div class="left-panel radius5px hide" id="left-panel">
                                    <div class="hide loading" id="loading"></div>
                                    <div class="title">
                                        <img src="" alt="" width="56" height="56" class="radius-circle avatar" id="userPic" />
                                        <span id="userName">&nbsp;</span>
                                        <span class="exit" title="退出" id="logout">退出</span>
                                    </div>
                                    <div class="panel" id="switchPanel">
                                        <a class="box-sizing tc m-unread panel_tab cur" data-type="sessions">
                                            <span class="icon icon-session"></span>
                                            <b class="u-unread hide"> </b>
                                        </a>
                                    </div>
                                    <div class="item" id="sessionsWrap" data-type="sessions">
                                        <!-- 最近联系人 -->
                                        <div class="list">
                                            <div id="sessions">
                                                <p>正在获取最近联系人...</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                %{--<div class="chatVernier" id="chatVernier">
                                    <span class="radius-circle hide"></span>
                                </div>--}%
                                <div class="right-panel hide radius5px" id="rightPanel">
                                    <!-- 聊天面板 -->
                                    <div class="chat-box show-netcall-box" id="chatBox">
                                        <div class="title hide" id="chatTitle">
                                            <img src="" width="56" height="56" class="radius-circle img" id="headImg" />
                                            <span id="nickName"></span>
                                        </div>
                                        <div class="netcall-box" id="netcallBox">
                                            <div class="netcall-mask hide">
                                                <div class="netcallTip"></div>
                                            </div>
                                            <div class="top hide">
                                                <span class="transferAudioAndVideo switchToAudio" id="switchToAudio">切换音频</span>
                                                <span class="transferAudioAndVideo switchToVideo" id="switchToVideo">切换视频</span>
                                                <span class="fullScreenIcon toggleFullScreenButton" id="toggleFullScreenButton" title="切换全屏">&nbsp;</span>
                                            </div>
                                            <div class="netcall-show-video hide" id="becallingEl">
                                                <div class="netcall-video-left">
                                                    <div class="netcall-video-remote bigView">
                                                        <div class="message"></div>
                                                        <span class="switchViewPositionButton"></span>
                                                    </div>
                                                </div>
                                                <div class="netcall-video-right">
                                                    <div class="netcall-video-local smallView">
                                                        <div class="message"></div>
                                                        <span class="switchViewPositionButton"></span>
                                                    </div>
                                                    <div class="operation">
                                                        <div class="control">
                                                            <div class="microphone control-item">
                                                                <div class="slider hide">
                                                                    <div class="txt">10</div>
                                                                    <input class="microSliderInput" id="microSliderInput1" type="range" min="0" max="10" step="1" value="10" data-orientation="vertical">
                                                                </div>
                                                                <span class="icon-micro"></span>
                                                            </div>
                                                            <div class="volume control-item">
                                                                <div class="slider hide">
                                                                    <div class="txt">10</div>
                                                                    <input class="volumeSliderInput" id="volumeSliderInput1" type="range" min="0" max="10" step="1" value="10" data-orientation="vertical">
                                                                </div>
                                                                <span class="icon-volume"></span>
                                                            </div>
                                                            <div class="camera control-item">
                                                                <span class="icon-camera"></span>
                                                            </div>
                                                        </div>
                                                        <div class="op">
                                                            <button class="hangupButton netcall-button red">挂断</button>
                                                        </div>
                                                        <div class="tip">00 : 00</div>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- 被叫界面 -->
                                            <div class="netcall-becalling-box hide" id="becallingActive">
                                                <img alt="用户头像" class="avatar">
                                                <div class="nick"></div>
                                                <p id="becallingText" class="tip"></p>
                                                <div class="op">
                                                    <div class="normal">
                                                        <div class="checking-tip">检查插件中...
                                                            <span class="netcall-icon-checking"></span>
                                                        </div>
                                                        <button class="netcall-button blue  beCallingAcceptButton" id="beCallingAcceptButton">
                                                            <span class="txt">接听</span>
                                                            <span class="netcall-icon-checking"></span>
                                                        </button>
                                                        <button class="netcall-button red beCallingRejectButton" id="beCallingRejectButton">
                                                            拒绝
                                                        </button>
                                                    </div>
                                                    <div class="exception">
                                                        <button class="netcall-button blue" id="downloadAgentButton">下载音视频插件</button>
                                                        <br/>
                                                        <button class="netcall-button red beCallingRejectButton">拒绝</button>
                                                        <div class="exception-tip">拒绝调用插件申请会导致无法唤起插件,需重启浏览器</div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="dialogs hide">
                                            </div>
                                        </div>
                                        <div id="whiteboard"></div>
                                        <div class="chat-content box-sizing" id="chatContent">
                                            <!-- 聊天记录 -->
                                        </div>
                                        <div class="u-chat-notice">您已退出</div>
                                        <div class="chat-mask"></div>
                                        <div class="chat-editor box-sizing hide" id="chatEditor" data-disabled="1">
                                            <!--<div id="emojiTag" class="m-emojiTag"></div>-->
                                            <a class="chat-btn u-emoji" id="showEmoji"></a>
                                            <span class="chat-btn msg-type" id="chooseFileBtn">
                                                <a class="icon icon-file" data-type="file"></a>
                                            </span>
                                            <a class="chat-btn u-netcall-audio-link" id="showNetcallAudioLink">&nbsp;</a>
                                            <a class="chat-btn u-netcall-video-link" id="showNetcallVideoLink">&nbsp;</a>
                                            <!-- 在netcall_ui.js的fn.whenOpenChatBox中隐藏 -->
                                            <a class="chat-btn u-whiteboard" id="showWhiteboard">&nbsp;</a>
                                            <textarea id="messageText" class="chat-btn msg-input box-sizing radius5px p2p" rows="1" autofocus="autofocus" maxlength="500"></textarea>
                                            <span class="chat-context" id="showTeamMsgReceipt">
                                                <label for="needTeamMsgReceipt">
                                                    <input id="needTeamMsgReceipt" type="checkbox" name="needTeamMsgReceipt" />回执</label>
                                            </span>
                                            <a class="btn-send radius5px" id="sendBtn">发送</a>
                                            %{--<form action="#" id="uploadForm">
                                                <input multiple="multiple" type="file" name="file" id="uploadFile" class="hide" />
                                            </form>--}%
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div style="clear: both"></div>

                        </div>
                        <div class="col-lg-12" id="formTest" style="max-height: 500px; overflow-y: scroll">
                            %{--<g:include controller="remoteSignFace" action="form1"></g:include>--}%
                        </div>
                    </div>
                </div>
                %{--<div class="panel-footer">
                    This is standard panel footer
                </div>--}%
            </div>
        </div>
    </div>
    <div class="asideBox">
        <div class="m-goWhiteboard hide">
            <span class="whiteboard-icon-state netcall-icon-state-audio"></span>
            <div class="nick"></div>
            <div class="tip"></div>
        </div>
        <div class="m-goNetcall hide">
            <span class="netcall-icon-state netcall-icon-state-audio"></span>
            <div class="nick">&nbsp;</div>
            <div class="tip">00 : 00</div>
        </div>
        <!--<a href="./chatroom/list.html" target="_blank">-->
        <!--<div class="u-goChartRoom"></div>-->
        <!--</a>-->
    </div>

    <div class="dialog-team-container radius5px hide" id="dialogTeamContainer"></div>
    <!-- 技术方案弹框 -->
    <div class="dialog-team-container radius5px hide" id="dialogCallMethod"></div>
    <!-- 消息中心 -->
</div>

<!-- 退出确认框 -->
<div class="dialog radius5px hide" id="logoutDialog">
    <span class="icon icon-close j-close"></span>
    <div class="content tc">确定要退出吗？</div>
    <div class="buttons tc">
        <button class="btn radius4px btn-cancel j-close">取消</button>
        <button class="btn radius4px btn-ok j-ok">确定</button>
    </div>
</div>
<!-- 添加好友 -->

<script>
    // IE 11 polify
    if (!Object.assign) {
        Object.assign = function () {
            var list = arguments
            for (var i = 1; i < list.length; i++) {
                list[0] = extend(list[0], list[i])
            }
            return list[0]
        }

        function extend(obj1, obj2) {
            for (var i in obj2) {
                obj1[i] = obj2[i]
            }
            return obj1
        }
    }
</script>

<asset:javascript src="boc/3rd/nim_server_conf.js"/>
<asset:javascript src="boc/3rd/NIM_Web_SDK_v5.6.0.js"/>
<asset:javascript src="boc/3rd/NIM_Web_Netcall_v5.6.0.js"/>
<asset:javascript src="boc/3rd/NIM_Web_WebRTC_v5.6.0.js"/>
<asset:javascript src="boc/3rd/NIM_Web_WhiteBoard_v5.6.0.js"/>
<asset:javascript src="boc/3rd/DrawPlugin.js"/>
<asset:javascript src="boc/remoteSignface/3rd/whiteboard.js"/>
<asset:javascript src="boc/3rd/jquery-1.11.3.min.js"/>
<!--<script src="../3rd/zepto.min.js"></script>-->
<script>
    // FastClick.attach(document.body);
    window.onerror = function (errorMessage, source, lineno, colno, error) {
        var info = "错误信息：" + errorMessage + "\n" +
            "出错文件：" + source + "\n " +
            "出错行号：" + lineno + "\n" +
            "出错列号：" + colno + "\n" +
            "错误详情：" + error + "\n";

        // alert(JSON.stringify(ERROR));
        // ajax.postp(monitorUrl, ERROR, null, function(e){
        //     alert(e.stack);
        // });
        console.error(JSON.stringify(info));
        // ajax.post('/data/updateLog', ERROR);
        // alert(JSON.stringify(info))
        // minAlert.alert({
        // 	msg: JSON.stringify(info),
        // 	confirmBtnMsg: '好哒'
        // })
    }
</script>

<!-- <script src="../3rd/platform.js"></script> -->
<asset:javascript src="boc/3rd/rtcSupport.js"/>
<asset:javascript src="boc/remoteSignface/3rd/jquery-ui.min.js"/>
<asset:javascript src="boc/3rd/rangeslider.min.js"/>
<!-- 右键菜单-->
<asset:javascript src="boc/remoteSignface/3rd/contextMenu/jquery.ui.position.js"/>
<asset:javascript src="boc/remoteSignface/3rd/contextMenu/jquery.contextMenu.js"/>

<asset:javascript src="boc/remoteSignface/config.js"/>
<asset:javascript src="boc/remoteSignface/util.js"/>
<asset:javascript src="boc/remoteSignface/cache.js"/>
<asset:javascript src="boc/remoteSignface/link.js"/>
<asset:javascript src="boc/remoteSignface/ui.js"/>
<asset:javascript src="boc/remoteSignface/widget/uiKit.js"/>
<asset:javascript src="boc/remoteSignface/widget/minAlert.js"/>
<asset:javascript src="boc/remoteSignface/module/base.js"/>
<asset:javascript src="boc/remoteSignface/module/sysMsg.js"/>
<asset:javascript src="boc/remoteSignface/module/personCard.js"/>
<asset:javascript src="boc/remoteSignface/module/session.js"/>
<asset:javascript src="boc/remoteSignface/module/friend.js"/>

<asset:javascript src="boc/remoteSignface/module/team.js"/>
<asset:javascript src="boc/remoteSignface/module/dialog_team.js"/>
<asset:javascript src="boc/remoteSignface/module/cloudMsg.js"/>
<asset:javascript src="boc/remoteSignface/module/notification.js"/>
<asset:javascript src="boc/remoteSignface/module/netcall1.js"/>
<asset:javascript src="boc/remoteSignface/module/netcall_meeting.js"/>
<asset:javascript src="boc/remoteSignface/module/netcall_ui.js"/>
<asset:javascript src="boc/remoteSignface/module/dialog_call_method.js"/>
<asset:javascript src="boc/remoteSignface/main.js"/>
<asset:javascript src="boc/3rd/vue.min.js"/>
<script id="whiteboard-template" type="text/x-template">
<div v-show="display" class="function-box whiteboard">
    <div v-if="banner.length" class="whiteboard-banner">
        <p>{{ banner }}</p>
    </div>
    <div v-if="tip.length" class="whiteboard-mask">
        <p>{{ tip }}</p>
    </div>
    <div v-if="bottomTip.length" class="whiteboard-bottom-tip">
        <p>{{ bottomTip }}</p>
    </div>
    <!-- P2P呼叫界面 -->
    <div v-if="!connected && isCalling">
        <img :src="avatar || '/assets/boc/default-icon.png'" alt="用户头像" class="avatar">
        <div class="nick">{{ nick }}</div>
        <div class="tip">{{ this.statusTip || '正在邀请对方，请稍候...' }} </div>
        <div class="op">
            <button @click="hangup" class="pure-button hangup">取消</button>
        </div>
    </div>
    <!-- P2P被叫界面 -->
    <div v-if="!connected && isCalled">
        <img :src="avatar || '/assets/boc/default-icon.png'" alt="用户头像" class="avatar">
        <div class="nick">{{ nick }}</div>
        <div class="tip">{{ this.statusTip || '邀请你进行白板互动' }}</div>
        <div v-if="needAgent" class="op download">
            <div>
                <button @click="downloadAgent" class="pure-button accept">下载插件</button>
            </div>
            <div>
                <button @click="reject" class="pure-button hangup">拒绝</button>
            </div>
            <div>
                <p>拒绝调用插件申请会导致无法唤起插件</p>
                <p>需重启浏览器</p>
            </div>
        </div>
        <div v-else class="op">
            <button @click="accept" class="pure-button accept">
                <span v-if="!waiting">接受</span>
                <span v-else class="netcall-icon-checking"></span>
            </button>
            <button @click="reject" class="pure-button hangup">拒绝</button>
        </div>
    </div>
    <!-- P2P白板界面 -->
    <div v-show="connected" class="whiteboard-ui pure-g">
        <div ref="container" class="pure-u-1-2 whiteboard-container"></div>
        <div class="pure-u-1-2 control-panel">
            <div class="pure-g btns">
                <div class="pure-u-1-3 control-btn">
                    <div class="btn-tip">撤销</div>
                    <span @click="undo" class="icon-undo"></span>
                </div>
                <div class="pure-u-1-3 control-btn">
                    <div class="btn-tip">清除全部笔迹</div>
                    <span @click="clear" class="icon-clear"></span>
                </div>
                <div class="pure-u-1-3 control-btn">
                    <div v-if="!canWeUseMicro" class="alert-icon">!</div>
                    <div v-if="!canWeUseMicro" class="btn-tip">麦克风不可用</div>
                    <div v-else-if="isMicroOpen" class="btn-tip">关闭己方语音</div>
                    <div v-else class="btn-tip">开启己方语音</div>
                    <span @click="switchAudio" class="icon-mic" :class="{
								close: !isMicroOpen,
								disable: !canWeUseMicro
							}"></span>
                </div>
            </div>
            <button @click="hangup" class="pure-button hangup">结束</button>
        </div>
    </div>
    <div class="dialogs"></div>
</div>
</script>
<asset:javascript src="boc/remoteSignface/module/whiteboard.js"/>

<script>
    $(function () {
        //30s一次 更新状态
        setInterval(setUserOnline,30000)


        function setUserOnline() {
            if(!$('#becallingActive').hasClass('hide')){
                $.ajax({
                    url: "/remoteSignFace/setUserStatus",
                    type: "post",
                    data: {"status": "busyline"},
                    success: function (data) {
                        console.log("用户状态已更新为忙")
                    }
                })
            }else if($('#becallingEl').hasClass('hide')) {
                $.ajax({
                    url: "/remoteSignFace/setUserStatus",
                    type: "post",
                    data: {"status": "online"},
                    success: function (data) {
                        console.log("用户状态已更新为在线")
                    }
                })
            }
        };



    })

</script>
</body>

</html>
